﻿@using Fzrain.Core.Domain.Lol
@{
    ViewBag.Title = "Index";
    Layout = "../Shared/_LayoutEmpty.cshtml";
}


<div id="example" class="container">

    @Html.Partial("Components/Menu")

    <div class="row clearfix">
        <div class="col-lg-4">
            <section id="profile" class="well">
                <h2 class="ra-well-title">个人信息</h2>

                <div class="row">
                    <div class="col-lg-5 col-sm-2">
                        <img src="/Content/lolpng/touxiang.png" style="margin-left: 10px; width: 88px;" alt=""/>
                    </div>

                    <div class="col-lg-7 col-sm-2">
                        @*<span class="ra-first-name">雷瑟守备</span>
                        <span class="ra-last-name">网络中断突然</span>*@

                    </div>
                </div>
            </section>
        </div>

        <div class="col-lg-8">
            <div id="tabstrip" class="ra-section">
                <ul>
                    <li class="k-state-active">
                        <span class="km-icon revenue"></span><span class="hidden-xs">战绩总览</span></li>
                    <li>
                        <span class="km-icon spd"></span><span class="hidden-xs">常用英雄</span></li>
                    <li>
                        <span class="km-icon spr"></span><span class="hidden-xs">擅长英雄</span></li>
                    <li>
                        <span class="km-icon share"></span><span class="hidden-xs">经典战役</span></li>
                </ul>
                <div>
                    <div style="float: left; width: 340px;">
                        @{ var dir = (Dictionary<int, int>) ViewBag.AppearRate; }
                        @(Html.Kendo().Chart()
                              .Name("chart1").Theme("fiori")
                              .Series(series => series.Pie(new dynamic[]
                              {
                                  new {category = "上单", value = dir[1]},
                                  new {category = "打野", value = dir[2]},
                                  new {category = "中单", value = dir[3]},
                                  new {category = "ADC", value = dir[4]},
                                  new {category = "辅助", value = dir[5]}
                              }))
                              .Tooltip(tooltip => tooltip
                                  .Visible(true).Template("#= category # - #= kendo.format('{0:P}', percentage)#(#= value #)"))
                              )

                    </div>
                    <div style="float: left;">
                        @{ var dirCarry = (Dictionary<int, int>) ViewBag.CarryAbility; }
                        @(Html.Kendo().Chart()
                              .Name("chart2").Theme("material")
                              .Series(series => series.Pie(new dynamic[]
                              {
                                  new {category = "强行Carry", value = dirCarry[1]},
                                  new {category = "稳定Carry", value = dirCarry[2]},
                                  new {category = "中规中矩", value = dirCarry[3]},
                                  new {category = "略有坑爹", value = dirCarry[4]},
                                  new {category = "非常坑爹", value = dirCarry[5]}
                              }))
                              .Tooltip(tooltip => tooltip
                                  .Visible(true).Template("#= category # - #= kendo.format('{0:P}', percentage)#(#= value #)"))
                              )


                    </div>
                </div>
                <div></div>
                <div></div>
                <div></div>
            </div>
        </div>
    </div>


    <div class="ra-section" style="height: 800px">
        @(Html.Kendo().Grid<Battle>()
              .Name("grid").Excel(c => c.FileName("data"))
              .Columns(columns =>
              {
                  columns.Bound(u => u.ChampionId).ClientTemplate("<img width='50' style='border-radius:50%' src='../../Content/lolpng/#=ChampionId#.png' alt='' />").Width(50).HtmlAttributes(new {style = "text-align:center"}).Filterable(filterable => filterable.UI("championFilter"));
                  columns.Bound(u => u.ChampionId).Width(30).HeaderTemplate("Id").Filterable(false);
                  columns.Bound(u => u.BattleType).Width(80).ClientTemplate("#=BattleType==6?'哭嚎深渊':'召唤师峡谷'#");
                  columns.Bound(u => u.StartTime).Width(80).Format("{0:yyyy-MM-dd HH:mm:ss}");
                  columns.Bound(u => u.Duration).Width(80).ClientTemplate("#=(Duration/60).toFixed(2)#");
                  columns.Bound(u => u.IsWin).Width(80).ClientTemplate("#=IsWin==1?'<font color=\"green\">胜利</font>':'<font color=\"red\">失败</font>'#");
                  columns.Bound(u => u.ContributeOrder).Width(80).ClientTemplate("#=ContributeOrder==1?'<img height=\"40px\" src=\"../../Content/mvp.png\"  />':ContributeOrder#");
                  columns.Command(c => c.Custom("战斗详情").Click("showDetails")).Width(80);
              })
              .ToolBar(c => c.Custom().Text("更新战绩").HtmlAttributes(new {id = "updateBattle"}))
              .Pageable(c => c.PageSizes(true).Messages(m => m.Next("下一页").ItemsPerPage("每页记录数")).Refresh(true))
              .Filterable(filterable => filterable
                  .Extra(false))
              .Scrollable().Sortable()
              .HtmlAttributes(new {style = "height:100%;"})
              .DataSource(dataSource => dataSource
                  .Ajax()
                  .PageSize(20)
                  .Model(model => model.Id(u => u.Id))
                  .Read(read => read.Action("Read", "Lol"))
              )
              )
    </div>
    <footer>Copyright &copy; @DateTime.Now.Year <a href="http://fzrain.apphb.com">Fzrain Inc</a>. All rights reserved.</footer>
</div>

@(Html.Kendo().Window()
      .Name("window").Visible(false)
      .Title("弹出页").Content(@<text>
                                @{
                                    var data = AccountInfo.Data().Select(d => new {d.QQ, d.QQuin}).Distinct().ToList();
                                    var qqInfo = new List<DropDownListItem>();
                                    foreach (var accountInfo in data)
                                    {
                                        qqInfo.Add(new DropDownListItem {Text = accountInfo.QQ, Value = accountInfo.QQuin});
                                    }
                                }
                                @Html.Kendo().DropDownList().BindTo(qqInfo).Name("txtQQ").Events(a => a.Change("areaOnChange"))
                                @{
                                    var data2 = AccountInfo.Data();
                                    var areaInfo = new List<DropDownListItem>();
                                    foreach (var accountInfo in data2)
                                    {
                                        areaInfo.Add(new DropDownListItem {Text = accountInfo.Area, Value = accountInfo.AreaId});
                                    }
                                }
                                @Html.Kendo().DropDownList().BindTo(areaInfo).Name("areaId").Events(a => a.Change("areaOnChange"))
                                @Html.Kendo().TextBox().Name("myRoleName")
                                @Html.Kendo().Button().Content("获取更新").Name("GetUpdateData").Events(e => e.Click("GetUpdateBattles"))
                                @Html.Kendo().Button().Content("更新").Name("update").Events(e => e.Click("updateAllbattle"))
                                <input type="hidden" id="ids"/>
                                <div id="content"></div>
                             </text>)
      .Draggable()
      .Modal(true)
      .Width(600).Height(400)
      .Actions(actions => actions.Minimize().Maximize().Close()).Position(a => a.Left(335).Top(100))
      )

@(Html.Kendo().Window()
      .Name("window2").Visible(false)
      .Title("战斗详情")
      .Draggable()
      .Modal(true)
      .Width(700).Height(470)
      .Actions(actions => actions.Minimize().Maximize().Close()).Position(a => a.Left(335).Top(100))
      )
<style>
    #menu { margin-bottom: 30px; }
</style>
<script type="text/javascript">
    $("#tabstrip").kendoTabStrip({
        animation: {
            open: { effects: "fadeIn" }
        }
    });
</script>

<script type="text/javascript">
    $("#updateBattle").bind("click", function() {
        $("#window").data("kendoWindow").open();
        return false;
    });

    function GetUpdateBattles() {
        $.post("/Lol/WaitUpdate", { qq: $("#txtQQ").val(), areaId: $("#areaId").val() }, function (data) {
            $("#content").val("");
            $("#ids").val(data);
            for (var i = 0; i < data.length; i++) {
                $("#content").append("<p>" + data[i] + "<p/>");
            }

        });
    }

    function showDetails(e) {
        e.preventDefault();
        var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
        var kendoWindow = $("#window2").data("kendoWindow");
        $.post("/Lol/GetBattleDetail", { GameId: dataItem.GameId }, function(data) {

            kendoWindow.content(data);
            kendoWindow.center().open();
        });


    }

    function updateAllbattle() {
        $.post("Lol/UpdateBattle", { ids: $("#ids").val(), areaId: $("#areaId").val(), myRoleName: $("#myRoleName").val() }, function(data) {
            if (data === "ok") {
                kendo.alert("更新成功！");
                $("#window").data("kendoWindow").close();
            }

        });
    }

    function championFilter(element) {
        element.kendoComboBox({
            dataSource: {
                transport: {
                    read: "@Url.Action("FilterMenuChampion")"
                }
            },
            template: "<img width='50px' src='../../Content/lolpng/#:data#.png' alt='' />"
        });
    }

    function areaOnChange(e) {
        $.post("Lol/GetAccountInfo", { areaId: $("#areaId").val(), qqUin: $("#txtQQ").val() }, function(data) {
            $("#myRoleName").val(data);
        });
    }
</script>